<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ page import="com.manage.servicecenter.ServiceCenterMessageVo"%>
<%@ page import="com.manage.servicecenter.ServiceCenterMessageHandleVo"%>
<%@ page import="java.util.List"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
ServiceCenterMessageVo detailVo = (ServiceCenterMessageVo)request.getAttribute("detail");
List<ServiceCenterMessageHandleVo> historyList = (List<ServiceCenterMessageHandleVo>)request.getAttribute("history");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<link href="<%=path%>/images/css.css" rel="stylesheet" type="text/css">
<link href="<%=path%>/css/sticky.min.css" rel="stylesheet" type="text/css">
<style> 
.hover{ 
	background-color:red; 
} 
</style>
<script type="text/javascript" src="<%=path%>/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="<%=path%>/js/sticky.min.js"></script>
<script type="text/javascript">
	var timer;
	var isTimerRun = false;
	$(function(){
		//初始化隐藏回复和转交
		$('#rettr').hide();
		$('#othertr').hide();
		$('#othertr2').hide();
		$("#finishbtn").attr('disabled',true);
		
		$('#rettr textarea').keyup(function(){
			if ( ''!=$('#rettr textarea').text() ) {
				if (!isTimerRun) {
					isTimerRun = true;
					timer = setInterval(flicker,1000);
				}
				$("#finishbtn").attr('disabled',false);
				$("#finishbtn").addClass('hover');
			} else {
				stopflicker();
			}
		});
		$('#othertr textarea').keyup(function(){
			if ( ''!=$('#othertr textarea').text() ) {
				if (!isTimerRun) {
					isTimerRun = true;
					timer = setInterval(flicker,1000);
				}
				$("#finishbtn").attr('disabled',false);
				$("#finishbtn").addClass('hover');
			} else {
				stopflicker();
			}
		});
		function flicker(){
			$('#finishbtn').fadeOut(500).fadeIn(500);
		}
		function stopflicker(){
			isTimerRun = false;
			$("#finishbtn").attr('disabled',true);
			$("#finishbtn").removeClass('hover');
			clearInterval(timer);
		}
		//回复
		$('#retbtn').click(function(){
			stopflicker();
			$('#rettr').show();
			$('#retbtn').attr('disabled',true);
			$('#othertr').hide();
			$('#othertr2').hide();
			$('#otherbtn').attr('disabled',false);
			$('#othertr textarea').text('');
			$('#othertr2 select').val('');
		});
		//转办
		$('#otherbtn').click(function(){
			stopflicker();
			$('#othertr').show();
			$('#othertr2').show();
			$('#otherbtn').attr('disabled',true);
			$('#rettr').hide();
			$('#retbtn').attr('disabled',false);
			$('#rettr textarea').text('');
		});
		//办结
		$('#finishbtn').click(function(){
			stopflicker();
			if ( $('#rettr textarea').text()!='' ) {
				$.post(
					"<%=path%>/ajax/answerPending.action", 
					{
						programid: "<%=detailVo.getId()%>",
						userid: "<%=detailVo.getSenduserid()%>",
						content: $('#rettr textarea').text()
					},
					function(json){
						var obj = $.parseJSON(json);
						alert(obj.content);
						if ('回复成功'==obj.content) {
							$('#qqbzform')[0].submit();
						}
					},"text"
				);
			} else {
				if ($('#othertr2 select').val()=='') {
					$.sticky("<font color='RED'>请选择转交人<font>");
					return;
				} else {
					$.post(
					"<%=path%>/ajax/passOnPending.action", 
					{
						programid: "<%=detailVo.getId()%>",
						userid: $('#othertr2 select').val(),
						content: $('#othertr textarea').text()
					},
					function(json){
						var obj = $.parseJSON(json);
						alert(obj.content);
						if ('转办成功'==obj.content) {
							$('#qqbzform')[0].submit();
						}
					},"text"
				);
				}
			}
		});
		//返回
		$('#backbtn').click(function(){
			$('#qqbzform')[0].submit();
		});
	});
</script>
</head>

<body class="bg_003">
<table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table>
<table width="98%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="201" height="30" align="center" background="<%=path%>/images/016.jpg"><table width="75%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="25"><img src="<%=path%>/images/1.png" width="16" height="16"></td>
        <td><strong>编号<%=detailVo.getId()%></strong></td>
      </tr>
    </table></td>
    <td align="right" background="<%=path%>/images/017.jpg" class="zi_006">待办详细信息</td>
    <td width="39"><img src="<%=path%>/images/018.jpg" width="39" height="30"></td>
  </tr>
</table>
<form action="<%=path%>/servicecenter/queryPassOnList.action" name = "qqbzform" id = "qqbzform">
<table width="98%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="1" bgcolor="#e1e1e2"></td>
        <td height="298" align="center"><table width="98%" border="0" align="center" cellpadding="3" cellspacing="1" bgcolor="#e1e1e1">
          <tr>
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">姓名：</td>
            <td width="22%" height="31" align="left" bgcolor="#f5f5f5">
            	<%=detailVo.getSenduserid()%>
            </td>
            <td width="12%" height="31" align="right" bgcolor="#f5f5f5">电话号码：</td>
            <td width="20%" height="31" align="left" bgcolor="#f5f5f5">
            	<%=detailVo.getSenduserid()%>
            </td>
          </tr>
          <tr>
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">电子邮箱：</td>
            <td width="22%" height="31" align="left" bgcolor="#f5f5f5">
            	<%=detailVo.getSenduserid()%>
            </td>
            <td width="12%" height="31" align="right" bgcolor="#f5f5f5">求助类别：</td>
            <td width="20%" height="31" align="left" bgcolor="#f5f5f5">
            	<%=detailVo.getMessagetype()%>
            </td>
          </tr>
          <tr>
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">主题：</td>
            <td width="22%" height="31" align="left" bgcolor="#f5f5f5" colspan="3">
				<%=detailVo.getTheme()%>
            </td>
          </tr>
          <tr>
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">内容：</td>
            <td width="22%" height="31" align="left" bgcolor="#f5f5f5" colspan="3">
            	<%=detailVo.getContent()%>
            </td>
          </tr>
          <tr>
          	<td width="10%" height="31" align="right" bgcolor="#f5f5f5">流转信息：</td>
            <td width="100%" align="left" bgcolor="#f5f5f5" colspan="3">
            	<%
            		for ( int i=0; i<historyList.size(); i++ ) {
            			String flowContentStr = "";
            			ServiceCenterMessageHandleVo tVo = historyList.get(i);
            			if (ServiceCenterMessageHandleVo.TYPE_START.equals(tVo.getType())) {
            				flowContentStr = tVo.getCreatedate()+" "+tVo.getSenduserid()+" 创建求助信息。<br/>";
            			} else if(ServiceCenterMessageHandleVo.TYPE_BACK.equals(tVo.getType())) {
            				flowContentStr = tVo.getCreatedate()+" "+tVo.getSenduserid()+" 回复求助信息；<br/>回复内容："+tVo.getContent()+"<br/>";
            			} else if(ServiceCenterMessageHandleVo.TYPE_PASS_ON.equals(tVo.getType())) {
            				flowContentStr = tVo.getCreatedate()+" "+tVo.getSenduserid()+" 转办求助信息 到 "+tVo.getUserid()+"；<br/>转办内容："+tVo.getContent()+"<br/>";
            			}
            	%>
            		<%=flowContentStr%>
            	<%
            		}
            	%>
            </td>
          </tr>
          <tr id="rettr">
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">回复：</td>
            <td width="22%" height="31" align="left" bgcolor="#f5f5f5" colspan="3">
            	<textarea id="qqbz_nr" rows="10" cols="100"></textarea>
            </td>
          </tr>
          <tr id="othertr">
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">转办：</td>
            <td width="22%" height="31" align="left" bgcolor="#f5f5f5" colspan="3">
            	<textarea id="qqbz_nr" rows="10" cols="100"></textarea>
            </td>
          </tr>
          <tr id="othertr2">
            <td width="10%" height="31" align="right" bgcolor="#f5f5f5">转交人：</td>
            <td width="22%"height="31" align="left" bgcolor="#f5f5f5" colspan="3">
            	<select id="qqbz_type" name="serviceCenterMessageVo.messagetype">
	              <option value="admin">-----请选择-----</option>
	              <option value="admin" selected>测试类别0</option>
	              <option value="2">测试类别1</option>
	              <option value="3">测试类别2</option>
	            </select>
            </td>
          </tr>
        </table>
          <table width="95%" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td height="50" align="center">
              	<input type="button" id="retbtn" value=" 回 复 ">
              	<input type="button" id="otherbtn" value=" 转 办 ">
              	<input type="button" id="finishbtn" value=" 办 结 ">
              	<input type="button" id="backbtn" value=" 返 回 ">
              </td>
            </tr>
          </table></td>
        <td width="1" bgcolor="#e1e1e2"></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="5" height="5"><img src="images/019.jpg" width="5" height="5"></td>
        <td width="100%" height="5" class="bg_002"></td>
        <td width="5" height="5"><img src="images/020.jpg" width="5" height="5"></td>
      </tr>
    </table></td>
  </tr>
</table>
<table width="603" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="26">&nbsp;</td>
  </tr>
</table>
</form>

</body>

</html>